package com.huluobo.a2208mdmdemo.demo

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.AccountCircle
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.AsyncImage
import com.huluobo.a2208mdmdemo.R

/**
 *  Created by LC on 2025/1/8.
 *  文本框,输入框,图片,横纵向布局,按钮
 */
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun demo01() {
    var name by remember {
        mutableStateOf("")
    }
    var pass by remember {
        mutableStateOf("")
    }

    var name1 = ""

//    Row(modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center) {
//        Text(text = "Hello $name")
//        Text(text = "Hello aa")
//        Text(text = "Hello bb")
//    }

    Column(
        //装饰器,用于包裹或者全屏
        modifier = Modifier.fillMaxSize(),
        //纵向位置
//        verticalArrangement = Arrangement.Center,
        //横向位置
//        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        //文本框
        Text(
            //文本
            text = "Hello$name",
            //颜色 colorResource拿到xml中的color
            color = colorResource(id = R.color.purple_200),
            //字号
            fontSize = 22.sp,
            //字体
            fontWeight = FontWeight.Normal,
            //字符间距
            letterSpacing = 13.sp,
            //文本方向
            textAlign = TextAlign.Center,
            //最大行数
            maxLines = 1,
            //超出范围后
            overflow = TextOverflow.Clip
        )
        TextField(
            value = name,
            onValueChange = {
                name = it
            },
            label = { Text(text = "用户名") },
            leadingIcon = { Icon(imageVector = Icons.Default.AccountCircle, contentDescription = "") },
            trailingIcon = { Icon(painter = painterResource(id = R.drawable.ic_action_eye), contentDescription = "") },
            visualTransformation = PasswordVisualTransformation(),
            shape = RoundedCornerShape(20.dp)
        )
        OutlinedTextField(
            value = pass, onValueChange = {
                //当值改变时可以赋值
                pass = it
            },
            //标签,在文本上方
            label = { Text(text = "密码") },
            //左侧图标  Icons.Default.AccountCircle 图标有2种形式,一种是imageVector 是系统默认图标
            leadingIcon = { Icon(imageVector = Icons.Default.AccountCircle, contentDescription = "") },
            //右侧图标 painter 从资源文件中拿到的图标
            trailingIcon = { Icon(painter = painterResource(id = R.drawable.ic_action_eye), contentDescription = "") },
            //文本形式,密文
            visualTransformation = PasswordVisualTransformation(),
            //形状,边框
            shape = RoundedCornerShape(20.dp)
        )

//        FilledTonalButton(
//            onClick = {
//                Log.i("TagA", "点击了登录")
//            }, modifier = Modifier.size(100.dp),
//            shape = CircleShape
//        ) {
//            Text(text = "登录")
//        }
//        Button(
//            onClick = { Log.i("TagA", "点击了登录") }, colors = ButtonDefaults.buttonColors(
//                containerColor = Color.Red,
//                contentColor = Color.Blue
//            )
//        ) {
//            Text(text = "登录")
//        }
//        OutlinedButton(onClick = { /*TODO*/ }) {
//            Text(text = "登录")
//        }
//
//        ElevatedButton(onClick = { /*TODO*/ }) {
//            Text(text = "登录")
//        }
//
//        TextButton(onClick = { /*TODO*/ }) {
//            Text(text = "登录")
//        }
//
//        OutlinedIconButton(onClick = { /*TODO*/ }) {
//            Text(text = "登录")
//        }
//        Image(imageVector = Icons.Default.AccountCircle, contentDescription = "")
//        Image(
//            painter = painterResource(id = R.drawable.icon1007),
//            contentDescription = "",
//            modifier = Modifier.clickable {
//                Log.i("TagA", "点击了图片")
//            })
        AsyncImage(
            model = "https://img1.baidu.com/it/u=4214113141,2036563917&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1729098000&t=0662d2b383091882ccdd43ad060de2a7",
            contentDescription = "这是一张网络图片",
//            contentScale = ContentScale.Crop,
//            modifier = Modifier
//                .width(100.dp)
//                .height(100.dp)
//                .clip(
//                    RoundedCornerShape(20.dp)
//                )
        )
    }
}